<template>
    <!-- 底部导航栏 -->
    <div id="nav">
      <mu-bottom-nav style="background-color: #2196f3;color: hsla(0,0%,100%,.7);">
        <router-link to="/goodsList">
          <mu-bottom-nav-item title="首页" icon="home"></mu-bottom-nav-item>
        </router-link>
        <router-link to="/unHandledOrder">
          <mu-bottom-nav-item title="待处理订单" icon="local_library"></mu-bottom-nav-item>
        </router-link>
        <router-link to="/handledOrder">
          <mu-bottom-nav-item title="已处理订单" icon="record_voice_over"></mu-bottom-nav-item>
        </router-link>
        <router-link to="/PersonalCenter">
          <mu-bottom-nav-item title="个人中心" icon="account_circle"></mu-bottom-nav-item>
        </router-link>
      </mu-bottom-nav>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        // shift: "index"
      };
    }
  };
  </script>
  
  <style lang="less">
  .mu-bottom-item-active {
    color: white !important;
  }
  a {
    color: rgba(218, 214, 214, 0.7) !important;;
  }
  // 固定底部导航栏位置
  #nav {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 1000;
  }
  </style>